var vm = new Vue({
  el: "#app",
  data: {
    title: '当前分类标题',
    comName: '推荐哈',
    // tabs: ['推荐哈1', '推哈哈2', '哈哈推3', '哈哈推4', '哈哈推5']
    tabs: [],
    type_id: null,//当前列表类型的id
    type_name:'',
    page: 1,//当前页数
    limit: 10,//限制条数
    render_list: [],
    isLoading: false,//上拉刷新时加载中
    myloadding: false,//切换时加载中
    list_loading: false,//上拉加载的加载中
    list_finished: false,//上拉加载完成,没有更多数据时
    lock: false
  },
  created: function () {
    this.init();
    //
  },
  mounted: function () {
  },
  methods: {
    init: function () {
      // var that = this;
      // $.ajax({
      //   url: app.webUrl + "/view/api_activity/typelist",
      //   data: { type: 1 },
      //   type: "POST",
      //   success: function (ret) {
      //     if (ret.code == '1') {
      //       console.log(ret);
      //       for (i in ret.data) {
      //         vm.tabs.push(ret.data[i]);
      //       };
      //       // tabs的第一项为默认项
      //       that.tabs[0].istag = true;
      //       that.type_id = that.tabs[0].id;
      //       // 获取列表
      //       that.myloadding = true;
      //       that.get_list(suc, err);
      //       function suc() {
      //         // that.myloadding = false;
      //         // 只有当lock为true时才让组件实行加载的方法
      //         that.open_lock();
      //       }
      //       function err() {
      //         that.myloadding = false;
      //       }
      //       zujian();
      //     }
      //   }
      // });
      var that = this;
      // 根据url获取分类id
      var id = app.GetQueryValue('fenleiId');
      that.type_id = id;
      var name = app.GetQueryValue('name');
      that.title = name;
      // 获取列表
      that.myloadding = true;
      that.get_list(suc, err);
      function suc(ret) {
        // that.title = ret.data[0].type[0].name;
        // that.myloadding = false;
        // 只有当lock为true时才让组件实行加载的方法
        that.open_lock();
      }
      function err() {
        that.myloadding = false;
      }

    },
    // 回到上一级页面
    closeWin:function(){
        window.history.back();
    },
    // 选择顶部栏
    chooseTab: function (tab) {
      this.tabs.forEach(function (item) {
        item.istag = false;
      });
      tab.istag = true;
      this.type_id = tab.id;
      var that = this;
      // 更新列表
      this.page = 1;
      this.render_list = [];
      this.myloadding = true;
      this.get_list(suc, err);
      function suc() {
        that.myloadding = false;
        that.list_finished = false;
        that.list_finished = false;
      }
      function err() {
        that.myloadding = false;
        that.list_finished = false;
        that.list_finished = false;
      }
      this.$forceUpdate();
    },
    // 获取列表
    get_list: function (suc, err) {
      var that = this;
      var data = {
        page: that.page,
        limit: that.limit,
        channel:that.title
      }
      $.post(app.webUrl + '/view/api_activity/lists', data, function (ret) {
        if (ret.code == '1') {
          ret.data.forEach(function (item) {
            that.render_list.push(item);
          });
          that.page++;
          // 成功的回掉函数
          if (typeof suc == 'function') {
            suc(ret);
          }
        } else {
          if (typeof err == 'function') {
            // 失败的回掉函数
            err(ret);
          }
        }
      }).fail(function (err) {
        err();
      })
    },
    // 下拉刷新
    onRefresh: function () {
      var that = this;
      that.lock = false;
      that.page = 1;
      that.render_list = [];
      this.get_list(suc, err);
      function suc() {
        vant.Toast('刷新成功');
        that.isLoading = false;
        that.list_finished = false;
        that.list_finished = false;
        that.open_lock();
      }
      function err() {
        vant.Toast('刷新失败');
        that.isLoading = false;
        that.list_finished = false;
        that.list_finished = false;
      }
    },
    // 上拉加载,jiaye
    onLoad: function () {
      var that = this;
      if (!that.lock) {
        that.list_loading = false;
        return;
      }
      this.get_list(suc, err);
      //
      function suc(ret) {
        // 加载状态结束
        that.list_loading = false;
        if (ret.data.length == 0) {
          that.list_finished = true;
        }
      }
      //
      function err(ret) {
        // 加载状态结束
        that.list_loading = false;
      }
    },
    // 打开lock
    open_lock: function () {
      var that = this;
      // 设一个延迟
      setTimeout(function () {
        that.lock = true;
      }, 1000)
    },
    // 跳转
    link: function (id) {
      window.location.href = 'http://wx191210.slyz.info:580/view/activity/hdxq.html?&activityId=' + id;
    }
  }
  // components: {
  //   'component-a': {
  //     template: `<button>{{msg}}</button>`,

  //     // data数据
  //     data: function() {
  //       return {
  //         msg: 'Rabbit'
  //       }
  //     }
  //   },
  //   // 'component-b': ComponentB
  // },
})
function zujian() {
  console.log(11111);

  console.log(vm.tabs[0].name);
  Vue.component(vm.tabs[0].name, {
    template: `
      <li @click="go_hdxq">
        <div class="logo"><img src="/public/img/wx.png" alt=""></div>
        <div class="cont">
          <p class="cont_name">
            <span>必胜客啊啊</span>
            <span style="margin: 0 2px;">|</span>
            <span>100元代金券·中行</span>
            <span style="margin: 0 2px;">|</span>
            <span>天天有券</span>
          </p>
          <p class="cont_price">
            <span>活动价:22元</span>
            <span>最近成交价:33元</span>
            <span><img src="/public/img/yanjing.png" alt="">2100</span>
          </p>
        </div>
      </li>
      `,
    methods: {
      go_hdxq() {
        window.location.href = "/view/activity/hdxq.html";
      }
    }
  })

  Vue.component(vm.tabs[1].name, {
    template: ` 
    <li @click="go_hdxq">
      <div class="logo"><img src="/public/img/zhifubao.png" alt=""></div>
      <div class="cont">
        <p class="cont_name">
          <span>必胜客啊啊</span>
          <span style="margin: 0 2px;">|</span>
          <span>100元代金券·中行</span>
          <span style="margin: 0 2px;">|</span>
          <span>天天有券</span>
        </p>
        <p class="cont_price">
          <span>活动价:33元</span>
          <span>最近成交价:44元</span>
          <span><img src="/public/img/yanjing.png" alt="">2100</span>
        </p>
      </div>
    </li>
    1111
    `,
    methods: {
      go_hdxq() {
        window.location.href = "/view/activity/hdxq.html";
      }
    }
  })
  Vue.component(vm.tabs[2].name, {
    template: `
    <li @click="go_hdxq">
      <div class="logo"><img src="/public/img/qq.png" alt=""></div>
      <div class="cont">
        <p class="cont_name">
          <span>必胜客啊啊</span>
          <span style="margin: 0 2px;">|</span>
          <span>100元代金券·中行</span>
          <span style="margin: 0 2px;">|</span>
          <span>天天有券</span>
        </p>
        <p class="cont_price">
          <span>活动价:22元</span>
          <span>最近成交价:33元</span>
          <span><img src="/public/img/yanjing.png" alt="">2100</span>
        </p>
      </div>
    </li>
    `,
    methods: {
      go_hdxq() {
        window.location.href = "/view/activity/hdxq.html";
      }
    }
  })
  Vue.component(vm.tabs[3].name, {
    template: `
    <li @click="go_hdxq">
      <div class="logo"><img src="/public/img/wxpyq.png" alt=""></div>
      <div class="cont">
        <p class="cont_name">
          <span>必胜客啊啊</span>
          <span style="margin: 0 2px;">|</span>
          <span>100元代金券·中行</span>
          <span style="margin: 0 2px;">|</span>
          <span>天天有券</span>
        </p>
        <p class="cont_price">
          <span>活动价:33元</span>
          <span>最近成交价:44元</span>
          <span><img src="/public/img/yanjing.png" alt="">2100</span>
        </p>
      </div>
    </li>
    `,
    methods: {
      go_hdxq() {
        window.location.href = "/view/activity/hdxq.html";
      }
    }
  })
  Vue.component(vm.tabs[4].name, {
    template: `
    <li @click="go_hdxq">
      <div class="logo"><img src="/public/img/chong.png" alt=""></div>
      <div class="cont">
        <p class="cont_name">
          <span>必胜客啊啊</span>
          <span style="margin: 0 2px;">|</span>
          <span>100元代金券·中行</span>
          <span style="margin: 0 2px;">|</span>
          <span>天天有券</span>
        </p>
        <p class="cont_price">
          <span>活动价:22元</span>
          <span>最近成交价:33元</span>
          <span><img src="/public/img/yanjing.png" alt="">2100</span>
        </p>
      </div>
    </li>
    `,
    targetmethods: {
      go_hdxq() {
        window.location.href = "/view/activity/hdxq.html";
      }
    }
  })
  vm.comName = vm.tabs[1].name;
  vm.comName = vm.tabs[0].name;
}







// 点击筛选按钮跳到筛选页面
$('.header-nav .shaixuan').click(function () {
  window.location.href = "/view/activity/fenleixuanze.html";
})

// 点击活动跳到活动详情页面
// $('main ul li' ).click(function() {
//   window.location.href="../../components/activity/html/hdxq.html";
// })
function go_hdxq() {
  window.location.href = "/view/activity/hdxq.html";
}


function fabu() {
  $('.fabu').show()
  console.log('11111')
  $('body').css('overflow-y', 'hidden')
}

function cancel() {
  $('.fabu').hide()
  console.log('11111')
  $('body').css('overflow-y', 'visible')
}